/** @jsxImportSource @emotion/react */
import * as React from "react";
import {
    CCell, Cell, InputDatalist, InputLine, Table, TableBody, TableHead, TableRow, Text, TextArea, useTheme,
} from "customize-easy-ui-component";
import {InspectRecordLayout, InternalItemProps, SelectInput, useItemInputControl,} from "../../common/base";
import {useMeasureInpFilter} from "../../common/hooks";
import {objNestSet} from "../../../common/tool";
import {DirectLink} from "../../../routing/Link";
import {TailMenRowIspCheck} from "../../contain/rarelyVary";
import {useOmnipotentPrefCs, useOmnipotentPrefTitle} from "../../hook/useOmnipotentPref";

interface Props extends InternalItemProps {
    titles?: any[];
    //检验结果字段 可选列表
    datalist?: string[];
}
//确保风格统一性做法：
const setupCf质保体=(theme?:any, edit?:boolean)=>{
    return [
        ['人员条', [{t:'资源条件的变化', s: 3}, ], '人员条件、工作场所、设备设施、资源条件是否满足《特种设备生产和充装单位许可规则》的要求。', ],
        ['人稳定', [{} ], '质量保证体系人员是否能够保持稳定且有效履职。',  ],
        ['资源条', [{} ], '项目部的资源条件是否满足施工现场实际需求。',  ],
        ['保措施', [{t:'质量体系的保持和改进', s: 7}, ], '项目部质量保证体系控制要素的设置和质量保证措施的制定是否齐全、合理。', ],
            //[统一依赖] <td/> '0.875rem' ===theme.fontSizes[0]
        ['保管毁', [{} ], <Text css={{fontSize: edit? undefined: theme?.fontSizes[0], fontWeight: edit? 800:undefined}}>
            检查文件的审核、批准、标识、发放、修改、回收、保管（方式、设施等）以及销毁是否按照质量保证体系文件的规定执行；检查安全技术规范以及标准等外来文件是否满足生产的需要，
            受控文件是否为有效版本；检查记录的填写、确认、收集、归档、保管与保管期限、销毁等方面的控制是否符合质量保证体系文件的规定。</Text>,  ],
        ['理化方', [{} ], '理化、热处理、无损检测等受委托（分包）方的评价和管理是否符合质量保证体系文件的规定。',  ],
        ['设备设', [{} ], '主要生产设备、工艺设备、检测仪器、试验装置等设备设施的控制是否符合质量保证体系文件。',  ],
        ['生产设', [{} ], '不合格品（项）的控制是否符合质量保证体系文件的规定。',  ],
        ['持证情', [{} ], '质量保证体系人员、检测人员、作业人员等对施工质量有重要影响的人员继续教育和持证情况',  ],
        ['投诉处', [{} ], '质量信息的处理、客户投诉的处置、内部审核和管理评审是否符合质量保证体系文件的规定。',  ],
        ['许可制', [{t:'执行许可制度', s: 1}, ], '特种设备许可制度的执行和许可证的使用管理是否符合安全技术规范的规定。', ],
        ['问处理', [{t:'监检发现问题处理', s: 1}, ], '《监检联络单》和《监检意见通知书》（2）的处理是否符合质量保证体系文件的规定，处理结果是否符合安全技术规范以及相关标准、设计文件的规定。', ],
    ];
};

const items质保体系 = setupCf质保体();
export const itemA质保体: string[] = ['质保备注','评结论'];
items质保体系.forEach(([name, title, initIsp], i: number) => {
    itemA质保体.push(name as string);
});
const 检验结果选=['符合','基本符合','不符合','不适用'];
export const QualityAssure =
React.forwardRef((
    {children, show, alone = true, redId, nestMd, label, datalist}: Props, ref
) => {
    const theme = useTheme();
    const [getInpFilter] = useMeasureInpFilter(null, itemA质保体,);
    const {inp, setInp} = useItemInputControl({ref});
    const config =React.useMemo(()=> setupCf质保体(theme,true),[theme]);
    const titNode=useOmnipotentPrefTitle({config });
    return <InspectRecordLayout inp={inp} setInp={setInp} getInpFilter={getInpFilter} show={show} redId={redId}
                                nestMd={nestMd} alone={alone} label={label!}>
        <Text>{label}：</Text>
        {config.map(([name, _1, _2, _unit]: any, i: number) => {
            return (<React.Fragment key={i}>
                <div css={{display: 'flex',flexWrap:'wrap',alignItems:'center'}}>
                    {titNode[i]}
                    &nbsp;检验结果：
                    <SelectInput value={ inp?.[name]?.r ||''}  list={datalist??检验结果选}  nMinW
                                 style={{display: 'inline-flex', width: '8rem'}}
                                 onChange={e => objNestSet(name,'r',e.currentTarget.value||undefined, inp, setInp) }/>
                </div>
            </React.Fragment>);
        })}
        <hr/>
        <Text variant="h5">问题说明：</Text>
        <TextArea  value={inp?.质保备注 ||''} rows={8}
                   onChange={e => setInp({ ...inp, 质保备注: e.currentTarget.value||undefined}) } />
        <Text variant="h5">评价结论：</Text>
        <InputLine  label={`评价结论：`}>
            <InputDatalist value={inp?.评结论 || ''} datalist={['符合','符合要求']}
                           onListChange={v => setInp({ ...inp, 评结论 :v || undefined}) } />
        </InputLine>
    </InspectRecordLayout>;
});

const tailRender = (orc: any, name: string) => <>
    <CCell>{orc?.[name]?.r ?? '／'}</CCell>
</>;
//没有备注栏目的
export const QualityAssureVw = ({orc, rep, title}: { orc: any, rep: any, title?: string }
) => {
    const theme= useTheme();
    const config =React.useMemo(()=> setupCf质保体(theme,false),[theme]);
             // const [renders] = useFixRowPrefUnt({orc, rep, config: items质保体系, tailRender,});
    const [renders] = useOmnipotentPrefCs({orc, config,
                       tag:'QualityAssure', tailRender, pcols: 1, noNo: false, unitCel: false});
    return <>
        <div css={{"@media print": {paddingBottom: '8rem', pageBreakInside: 'avoid'}}}>
            <Text id='QualityAssure' variant="h3" css={{
                textAlign: 'center', marginTop: '1rem',
            }}>{title ?? '公用热力管道施工单位质量保证体系实施状况评价报告'}</Text>
            <div css={{display: 'flex', justifyContent: 'space-between'}}>
                <Text></Text>
                <Text>报告编号：{rep.isp.no}</Text>
            </div>
        </div>
        <Table fixed={["12%", "%"]} css={{borderCollapse: 'collapse', "@media print": {marginTop: '-8rem'}}} tight
               miniw={800}>
            <TableBody>
                <TableRow><CCell>工程名称</CCell><CCell>{orc?.工程名称}</CCell></TableRow>
                <TableRow><CCell>施工单位</CCell><CCell>{orc?.施单位}</CCell></TableRow>
                <TableRow><CCell>评价依据</CCell><CCell>《压力管道监督检验规则》（TSG D7006-2020）<br/>
                    《特种设备生产和充装单位许可规则》（TSG 07-2019）</CCell></TableRow>
            </TableBody>
        </Table>
        <Table fixed={["3.5%", "8%", "%", "25%"]} css={{borderCollapse: 'collapse',}} tight miniw={800}>
            <TableHead>
                <TableRow>
                    <CCell><Text
                        css={{fontSize: '0.7rem'}}>序号</Text></CCell><CCell>项目</CCell><CCell>检查内容</CCell><CCell>检验结果</CCell>
                </TableRow>
            </TableHead>
            <TableBody>
                <DirectLink
                    href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/QualityAssure#QualityAssure`}>
                    {renders}
                    <TableRow>
                        <Cell colSpan={4}>
                            <div css={{
                                minHeight: '3rem', whiteSpace: 'pre-wrap'
                            }}>问题说明：<br/>{orc.质保备注 ?? '／'}</div>
                        </Cell>
                    </TableRow>
                    <TableRow><CCell colSpan={2}>评价结论：</CCell><CCell colSpan={2}>{orc?.评结论}</CCell></TableRow>
                </DirectLink>
            </TableBody>
        </Table>
        <TailMenRowIspCheck orc={orc} rep={rep} href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/ProjectList#ProjectList`}/>
    </>;
};
